import {topN} from '@/services/delay-stat-api';
import {
  ActionType,
  PageContainer,
  ProColumns,
  ProDescriptions,
  ProDescriptionsItemProps, ProFormText,
  ProTable
} from '@ant-design/pro-components';
import {Drawer} from 'antd';
import React, {useRef, useState} from 'react';

const TopN: React.FC = () => {

  /**
   * @en-US The pop-up window of the distribution update window
   * @zh-CN 分布更新窗口的弹窗
   * */
  const [showDetail, setShowDetail] = useState<boolean>(false);

  const actionRef = useRef<ActionType>();
  const [currentRow, setCurrentRow] = useState<API.TopDelayStatDTO>();
  const [minute, setMinute] = useState<number>(1);

  const commonColumns: ProColumns<API.TopDelayStatDTO>[] = [
    {
      title: 'Top',
      dataIndex: 'index',
      valueType: 'indexBorder',
      hideInSearch: true
    },
    {
      title: 'Channel名字',
      dataIndex: 'channelName',
      hideInSearch: true
    },
    {
      title: 'Pipeline信息',
      dataIndex: 'pipelineName',
      hideInSearch: true
    },
    {
      title: '延迟时间',
      dataIndex: 'delayTime',
      hideInSearch: true
    },
    {
      title: '最后采集间隔（s）',
      dataIndex: 'lastUpdateDelay',
      hideInSearch: true
    },
    {
      title: `DB数量${minute}分钟`,
      dataIndex: ['dbStat', 'number'],
      hideInSearch: true
    },
    {
      title: `DB大小${minute}分钟`,
      dataIndex: ['dbStat', 'size'],
      hideInSearch: true
    },
    {
      title: `文件数量(${minute}分钟）`,
      dataIndex: ['fileStat', 'number'],
      hideInSearch: true
    },
    {
      title: `文件大小(${minute}分钟)`,
      dataIndex: ['fileStat', 'size'],
      hideInSearch: true
    },
    {
      title: `Top分钟数`,
      dataIndex: ['minute'],
      hideInTable: true,
    },
    {
      title: `TopN`,
      dataIndex: ['topN'],
      hideInTable: true,
    },
    {
      title: 'channel状态',
      dataIndex: ['status'],
      hideInSearch: true,
      valueEnum: () => {
        return {
          'START': {text: '运行中', status: 'Processing'},
          'PAUSE': {
            text: '挂起', status: 'Warning'
          },
          'STOP': {
            text: '停止', status: 'Default'
          },
        }
      }
    },
    {
      title: 'pipeline状态',
      dataIndex: ['eventData', 'status'],
      hideInSearch: true,
      renderText: (status: string) => status ? status === 'TAKEING' ? '定位中' : '工作中' : '未工作',
    },

    {
      title: '描述',
      dataIndex: ['description'],
      hideInSearch: true
    }
  ]

  const descriptionColumns: ProColumns<API.TopDelayStat>[] = [
    ...commonColumns,

  ];

  const columns: ProColumns<API.TopDelayStat>[] = [
    ...commonColumns,
    {
      title: '操作',
      dataIndex: 'option',
      valueType: 'option',
      render: (_, record) => [
        <a
          key="detail"
          onClick={() => {
            setCurrentRow(record);
            setShowDetail(true);
          }}
        >
          查看
        </a>
      ]

    }
  ];

  return (
    <PageContainer>
      <ProTable<API.TopDelayStat, API.TopNPage>
        headerTitle='TopN列表'
        form={{
          onFieldsChange: (fields) => {
            const minuteField = fields.findLast(f => f.name.indexOf('minute') > -1);
            if (minuteField) {
              setMinute(minuteField.value);
            }
          }}
        }
        actionRef={actionRef}
        rowKey="key"
        search={{
          labelWidth: 120
        }}
        pagination={false}
        request={topN}
        params={{minute: minute}}
        columns={columns}
      />
      <Drawer
        width={500}
        open={showDetail}
        onClose={() => {
          setCurrentRow(undefined);
          setShowDetail(false);
        }}
        closable={false}
      >
        {currentRow?.channelId && (
          <ProDescriptions<API.TopDelayStatDTO>
            column={2}
            title={currentRow?.channelName}
            dataSource={currentRow}
            columns={descriptionColumns as ProDescriptionsItemProps<API.TopDelayStatDTO>[]}
          />
        )}
      </Drawer>
    </PageContainer>
  );
};

export default TopN;
